<ion-header>
  <ng-container *ngIf="!isSearch">
    <ion-toolbar>
      <ion-buttons slot="start">
        <ion-button appDebounceClick (debounceClick)="doDiss()">
          <img src="assets/img/back_left.png" class="backBtnStyle" />
        </ion-button>
      </ion-buttons>
      <ion-title class="commonTitleText">{{ modalTitle }}</ion-title>
      <ion-buttons slot="end">
        <ion-button appDebounceClick (debounceClick)="clk()">
          <img
            src="assets/img/nav_icon_filter@3x.png"
            class="backBtnStyle"
          />
        </ion-button>
      </ion-buttons>
    </ion-toolbar>
  </ng-container>

  <ng-container *ngIf="isSearch">
    <ion-toolbar>
      <ion-buttons slot="start">
        <ion-button appDebounceClick (debounceClick)="doDiss()">
          <img src="assets/img/back_left.png" class="backBtnStyle" />
        </ion-button>
      </ion-buttons>
      <ion-searchbar
        [placeholder]="pageData?.searchBar?.placeholder"
        autocomplete="on"
        [(ngModel)]="key"
        (ionFocus)="isHistory = true"
      ></ion-searchbar>
      <ion-buttons slot="end">
        <ion-button appDebounceClick (debounceClick)="search()">
          {{ pageData?.searchBar?.label }}
        </ion-button>
      </ion-buttons>
    </ion-toolbar>
    
  </ng-container>
</ion-header>
<ion-content>
  <ng-container *ngIf="!isHistory">
    
    <ul *ngIf="treeData.length > 0">
      <app-tree-node
        [nzTreeNode]="treeData"
        [httpData]="httpData"
        [value]="value"
        (clickValue)="onValue($event)"
      ></app-tree-node>
    </ul>

    <!-- <div class="footer">
      <div class="confirm" appDebounceClick (debounceClick)="submit()" *ngIf="pageData?.button[0]?.label">
        <span>{{ pageData?.button[0]?.label }}</span>
      </div>
    </div> -->
  </ng-container>
  <ng-container *ngIf="isHistory">
    <div *ngFor="let item of searchArr">
      <ion-item detail="false" class="list-item" appDebounceClick (debounceClick)="searchHistory(item)">
        <ion-label>
          <img class="icon" src="assets/img/lately.png" alt="xxx" />
          <span>{{ item }}</span>
        </ion-label>
      </ion-item>
      <hr class="list-sep" />
    </div>
    <p
      class="tac clearText"
      *ngIf="searchArr?.length > 0"
      appDebounceClick (debounceClick)="clearHistory()"
    >
      <img
        class="icon-del"
        src="assets/img/search_icon_delete@3x.png"
        alt="xxx"
      />
      <span>清除历史记录</span>
    </p>
  </ng-container>
</ion-content>
<ng-container *ngIf="!isHistory">
  <ion-footer >
    <div class="footer">
      <div class="confirm" appDebounceClick (debounceClick)="submit()" *ngIf="pageData?.button[0]?.label">
        <span>{{ pageData?.button[0]?.label }}</span>
      </div>
    </div>
  </ion-footer>

  
</ng-container>

